<template>
	<div>
	
	 <el-card shadow="always">
		<el-row :gutter="12">
		  <el-col :span='4'>
		    
		      <el-button type="primary" @click="selectAll()" icon="el-icon-refresh-right">刷新</el-button>
			  <el-button type="success" @click="dialogTableVisible = true" icon="el-icon-circle-plus-outline">增方</el-button>
		    <div style="margin-top: 25px;">
		    	<el-input placeholder="请输入挂号ID" v-model="tableData.registid" class="input-with-select" clearable>
		    		<el-button slot="append" icon="el-icon-search" @click="selectById()"></el-button>
		    	</el-input>
		    </div>
		  </el-col>
		</el-row>
		
		<el-table :data="tableData" style="width: 100%" stripe highlight-current-row>
					<el-table-column prop="id" label="id" sortable width=110>
					</el-table-column>
					<el-table-column prop="medicalid" label="病历 ID" sortable >
					</el-table-column>
					<el-table-column prop="registid" label="挂号 ID" sortable>
					</el-table-column>
					<el-table-column prop="userid" label="开立医生" sortable>
						<template slot-scope="scope" >
							<el-tag size="medium" type="success	" v-if="scope.row.userid===1 ">扁鹊</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===2">范无病</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===3">霍去病</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===4">华佗</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===5">喜来乐</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===6">安道全</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===8">单独</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===9">ROOT</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===10">挂号收费员</el-tag>
							<el-tag size="medium" type="success" v-else-if="scope.row.userid===11">医院管理员</el-tag>
							<el-tag size="medium" type="info" v-else>其他</el-tag>
						</template>
					</el-table-column>
					<el-table-column prop="prescriptionname" label="处方名称" sortable>
					</el-table-column>
					<el-table-column prop="prescriptiontime" label="开立时间" sortable>
					</el-table-column>
					<el-table-column prop="prescriptionstate" label="处方状态" sortable>
						<template slot-scope="scope">
							<el-tag size="medium" type="warning" v-if="scope.row.prescriptionstate===2">已开立</el-tag>
							<el-tag size="medium" v-else-if="scope.row.prescriptionstate===1">暂存</el-tag>
							<el-tag size="medium" type="success" v-else>其他</el-tag>
						</template>
					</el-table-column>
					<el-table-column label="操作">
						<template slot-scope="scope">
							<el-button type="primary" @click="PDselectById(scope.row.id)" size="small" icon="el-icon-edit-outline"
		>暂存</el-button>
							<el-button type="success" @click.native.prevent="deleteRow(scope.$index, tableData) " size="small" icon="el-icon-upload2">
								发送</el-button>
						</template>
					</el-table-column>
				</el-table>
	  </el-card>
		
		<el-dialog title="增方" :visible.sync="dialogTableVisible" width="30%">
			<!-- <div class="demo-input-suffix"> -->
			<el-form ref="form" label-width="80px">
				<el-form-item label="病历ID" style="margin-top: 15px;">
					<el-input placeholder="请输入病例ID" v-model="addtableData.medicalid" style="width:300px" >
					</el-input>
				</el-form-item>
				<el-form-item label="挂号ID" style="margin-top: 15px;">
					<el-input placeholder="请输入挂号ID" v-model="addtableData.registid" style="width:300px" >
					</el-input>
				</el-form-item>
				<el-form-item label="开立医ID" style="margin-top: 15px;">
					<el-input placeholder="请输入开立医生ID" v-model="addtableData.userid" style="width:300px" >
					</el-input>
				</el-form-item>
				<el-form-item label="处方名称" style="margin-top: 15px;">
					<el-input placeholder="请输入处方名称" v-model="addtableData.prescriptionname" style="width:300px" >
					</el-input>
				</el-form-item>
				<el-form-item label="开立时间" style="margin-top: 15px;">
					<el-input placeholder="请输入开立时间" v-model="addtableData.prescriptiontime" style="width:300px" >
					</el-input>
				</el-form-item>
				<el-form-item label="处方状态" style="margin-top: 15px;">
					<!-- <el-input placeholder="请输入处方状态" v-model="addtableData.prescriptionstate"
					style="width:500px">
				</el-input> -->
					<el-switch v-model="addtableData.prescriptionstate" active-color="#409EFF" inactive-color="#E6A23C"
						active-value="1" inactive-value="2" active-text="暂存" inactive-text="已开立">
					</el-switch>
				</el-form-item>
				</br>
				<el-button type="primary" @click="add()" style="margin-top: 15px;" :plain="true">提交</el-button>
				<el-button @click="dialogTableVisible = false" style="margin-top: 15px;">取消</el-button>
				<!-- </div> -->
			</el-form>
		</el-dialog>

		<el-dialog title="患者成药处方明细表" :visible.sync="dialogFormVisible" width="58%">

			<el-button type="danger" @click="prescriptiondel(prescriptiondeldata)">删方</el-button>
			<el-button type="primary" @click="dialogotherFormVisible = true">增药</el-button>

			<el-table :data="PDtableData" style="margin-top: 15px; width: 96%">
				<el-table-column prop="id" label="id" sortable>
				</el-table-column>
				<el-table-column prop="prescriptionid" label="成药处方ID" sortable>
				</el-table-column>
				<el-table-column prop="drugsid" label="药品ID" sortable>
				</el-table-column>
				<el-table-column prop="drugsusage" label="用法" sortable>
				</el-table-column>
				<el-table-column prop="dosage" label="用量" sortable>
				</el-table-column>
				<el-table-column prop="frequency" label="频次" sortable>
				</el-table-column>
				<el-table-column prop="amount" label="数量" sortable>
				</el-table-column>
				<el-table-column prop="state" label="状态" sortable>
					<template slot-scope="scope">
						<el-tag size="medium" type="warning" v-if="scope.row.state===2">已开立</el-tag>
						<el-tag size="medium" type="primary" v-else-if="scope.row.state===3">已交费</el-tag>
						<el-tag size="medium" type="success" v-else-if="scope.row.state===4">已发药</el-tag>
						<el-tag size="medium" type="info" v-else-if="scope.row.state===5">已退药</el-tag>
						<el-tag size="medium" type="danger" v-else>已退费</el-tag>
					</template>
				</el-table-column>
				<el-table-column label="操作">
					<template slot-scope="scope">
						<el-button type="primary" @click="PrescriptionselectById(scope.row.prescriptionid)"
							size="small" icon="el-icon-refresh-right">刷新</el-button>
							<div style="text-align: right; margin: 0">
							</div>
							<el-button slot="reference" type="danger" size="small" @click="drugsdel(scope.row.id)" icon="el-icon-remove-outline">删药</el-button>
						
					</template>
				</el-table-column>
				</br>
				<el-button type="primary" @click="add()" style="margin-top: 15px;">提交</el-button>
				<el-button @click="dialogTableVisible = false" style="margin-top: 15px;">取消</el-button>
			</el-table>
		</el-dialog>

		<el-dialog title="处方增药" :visible.sync="dialogotherFormVisible">
			<div style="margin-top: 15px;">
				<el-input placeholder="请输入药品ID" v-model="DrugsDetailedtableData.drugsid" style="width:900px" clearable>
					<el-button slot="append" icon="el-icon-search" @click="DrugsDetailedselectById()"></el-button>
				</el-input>
			</div>

			<el-table :data="DrugsDetailedtableData" style="margin-top: 15px; width: 96%" highlight-current-row>
				<el-table-column prop="id" label="id" sortable>
				</el-table-column>
				<el-table-column prop="drugstempid" label="成药模板ID" sortable>
				</el-table-column>
				<el-table-column prop="drugsid" label="药品ID" sortable>
				</el-table-column>
				<el-table-column prop="drugsusage" label="用法" sortable>
				</el-table-column>
				<el-table-column prop="dosage" label="用量" sortable>
				</el-table-column>
				<el-table-column prop="frequency" label="频次" sortable>
				</el-table-column>
				</br>
				<el-button type="primary" @click="add()" style="margin-top: 15px;">提交</el-button>
				<el-button @click="dialogTableVisible = false" style="margin-top: 15px;">取消</el-button>
			</el-table>

			<el-form>
				<el-form-item label="处方ID" style="margin-top: 35px;">
					<el-input placeholder="请输入成药处方ID" v-model="drugsaddtableData.prescriptionid" style="width:700px">
					</el-input>
				</el-form-item>
				<el-form-item label="药品ID">
					<el-input placeholder="请输入药品ID" v-model="drugsaddtableData.drugsid" style="width:700px" ></el-input>
				</el-form-item>
				<el-form-item label="药品用法">
					<el-input placeholder="请输入用法" v-model="drugsaddtableData.drugsusage" style="width:700px" ></el-input>
				</el-form-item>
				<el-form-item label="药品用量">
					<el-input placeholder="请输入用量" v-model="drugsaddtableData.dosage" style="width:700px" ></el-input>
				</el-form-item>
				<el-form-item label="服用频次">
					<el-input placeholder="请输入频次" v-model="drugsaddtableData.frequency" style="width:700px" ></el-input>
				</el-form-item>
				<el-form-item label="药品数量">
					<el-input placeholder="请输入数量" v-model="drugsaddtableData.amount" style="width:700px" ></el-input>
				</el-form-item>
				<el-form-item label="支付状态">
					<el-input placeholder="请输入状态" v-model="drugsaddtableData.state" style="width:700px" ></el-input>
				</el-form-item>
			</el-form>

			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogotherFormVisible = false">取 消</el-button>
				<el-button type="primary" @click="drugsadd()" :plain="true">确 定</el-button>
			</div>

		</el-dialog>



		

		</br>


		

	</div>

</template>

<script>
	export default {
		name: 'PatientPrescription',
		data() {
			return {
				tableData: {
					id: '',
					medicalid: '',
					registid: '',
					userid: '',
					prescriptionname: '',
					prescriptiontime: '',
					prescriptionstate: '',
					state: '',
				},
				addtableData: {
					id: '',
					medicalid: '',
					registid: '',
					userid: '',
					prescriptionname: '',
					prescriptiontime: '',
					prescriptionstate: '1'
				},
				DrugsDetailedtableData: {
					id: '',
					drugstempid: '',
					drugsid: '',
					drugsusage: '',
					dosage: '',
					frequency: '',
				},
				drugsaddtableData: {
					id: '',
					prescriptionid: '',
					drugsid: '',
					drugsusage: '',
					dosage: '',
					frequency: '',
					amount: '',
					state: ''
				},
				prescriptiondeldata: {
					id: ''
				},
				statetable: {
					state1: '暂存',
					state2: '已开立'
				},
				PDtableData: [],
				dialogVisible: false,
				dialogFormVisible: false,
				dialogTableVisible: false,
				dialogotherFormVisible: false,
				visible: false,
				delvisible: false
			}
		},
		created() {
			let url = '/prescription/selectAll'
			this.$axios.post(url)
				.then((resp) => {
					this.tableData = resp.data;
					console.log(this.tableData)
				})
		},
		methods: {

			deleteRow(index, rows) {

				rows.splice(index, 1);
			},
			stateswitch1() {
				this.tableData.state = this.statetable.state1
			},
			selectAll() {
				let url = '/prescription/selectAll'
				this.$axios.post(url)
					.then((resp) => {
						this.tableData = resp.data;
						console.log(this.tableData)
					})
			},
			selectById() {
				let url = '/prescription/selectById'
				let param = this.$qs.stringify(this.tableData);
				this.$axios.post(url, param)
					.then((resp) => {
						this.tableData = resp.data;
						console.log(this.tableData)
					})
			},
			add() {
				let url = '/prescription/add';
				let param = this.$qs.stringify(this.addtableData);
				this.$axios.post(url, param)
					.then((resp) => {
						let i = resp.data;
						if (i > 0) {
							this.$notify({
								title: '增放成功',
								message: '这是一条成功的提示消息',
								type: 'success'
							})
						}
					})
					.catch((err) => {
						console.log('error=', err);
					})
			},
			PDselectById(id) {

				console.log(id);
				this.prescriptiondeldata = id;
				console.log(this.prescriptiondeldata);
				let url = '/prescriptiondetailed/selectById'
				let param = {};
				param.id = id;
				param = this.$qs.stringify(param);
				this.$axios.post(url, param)
					.then((resp) => {
						//push
						//zhijiefuzhi
						this.PDtableData = resp.data;
						console.log(this.PDtableData);
						this.dialogFormVisible = true
					})

			},
			DrugsDetailedselectById() {
				let url = 'drugsdetailed/selectById'
				let param = this.$qs.stringify(this.DrugsDetailedtableData);
				this.$axios.post(url, param)
					.then((resp) => {
						this.DrugsDetailedtableData = resp.data;
						console.log(this.DrugsDetailedtableData)
					})
			},
			drugsadd() {
				let url = '/prescriptiondetailed/add';
				let param = this.$qs.stringify(this.drugsaddtableData);
				this.$axios.post(url, param)
					.then((resp) => {
						let i = resp.data;
						if (i > 0) {
							this.$notify({
								title: '增药成功',
								message: '这是一条成功的提示消息',
								type: 'success'
							})
						}
					})
					.catch((err) => {
						console.log('error=', err);
					})
			},
			PrescriptionselectById(prescriptionid) {

				console.log(prescriptionid);
				let url = '/prescriptiondetailed/prescriptionselectById'
				let param = {};
				param.prescriptionid = prescriptionid;
				param = this.$qs.stringify(param);
				this.$axios.post(url, param)
					.then((resp) => {
						//push
						//zhijiefuzhi
						this.PDtableData = resp.data;
						console.log(this.PDtableData);
					})
			},
			drugsdel(id) {

				this.visible = false;
				let url = '/prescriptiondetailed/delete'
				let param = {};
				param.id = id;
				param = this.$qs.stringify(param);
				this.$axios.post(url, param)
					.then((resp) => {
						let i = resp.data;
						if (i > 0) {
							this.$notify({
								title: '删药成功',
								message: '成功删除此药房',
								type: 'success'
							})
						}
					})
					.catch((err) => {
						console.log('error=', err);
					})
			},
			prescriptiondel(prescriptiondeldata) {

				this.delvisible = false;
				console.log(prescriptiondeldata);
				let url = '/prescription/delete'
				let param = {};
				param.id = prescriptiondeldata;
				param = this.$qs.stringify(param);
				this.$axios.post(url, param)
					.then((resp) => {
						let i = resp.data;
						if (i > 0) {
							this.$notify({
								title: '删方成功',
								message: '成功删除此处方',
								type: 'success'
							})
						}
					})
					.catch((err) => {
						console.log('error=', err);
					})
			}
		}
	}
</script>

<!-- scoped="scoped"表示当前样式属于局部样式，只在当前组件中有效 -->
<!-- <style scoped="scoped">
	div {
		width: 100%;
		margin: 0 auto;
		text-align: center;
	}
</style> -->
